<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>For You</title>
    <script src="./src/js/flexible.js"></script>
    <link rel="icon" href="./favicon32.ico" type="image/ico">
    <link rel="stylesheet" href="./src/css/main.css">
    <link rel="stylesheet" href="./src/font/iconfont.css">
</head>
<body>
    <div class="first-screen">
        <ul>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
    <audio id="testaudio">
        <source src="./src/music/少年.mp3">
    </audio>
    <div class="aside_change">
        <ul>
            <li class="active"></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
    <div class="wrap">
        <section class="page_one">
            <div class="search">
                <div class="sear_wrap">
                    <div class="sear_selector">
                        <div class="sear_top">
                            <div class="top_active" data-url='https://route.showapi.com/950-1'>藏头诗</div>
                            <div>IP地址查询</div>
                            <div data-url='https://route.showapi.com/6-1'>手机归属地</div>
                            <div>测吉凶</div>
                            <div>成语大全</div>
                        </div>
                        <div class="sear_bottom">
                            <div class="innerwrap_one">
                                <div class="cts_options"><span>几言:</span><div data-num="5" class="selector_active">五言</div><div data-num="7">七言</div></div>
                                <div class="cts_options">
                                    <span>藏哪:</span>
                                    <div data-type="1" class="selector_active">藏头</div>
                                    <div data-type="2">藏尾</div>
                                    <div data-type="3">藏中</div>
                                    <div data-type="4">递增</div>
                                    <div data-type="5">递减</div>
                                </div>
                                <div class="cts_options">
                                    <span>押韵类型:</span>
                                    <div data-yayuntype="1" class="selector_active">双句一押</div>
                                    <div data-yayuntype="2">双句押韵</div>
                                    <div data-yayuntype="3">一三四押</div>
                                </div>
                                <div class="gl_input">
                                    <label for="key">关键字:</label>
                                    <input type="text" id="key" maxlength="8" value="" placeholder="1-8个中文" required>
                                </div>
                                <div class="button">
                                    <button class="query">查询</button>
                                    <button class="colose">关闭</button>
                                </div>
                            </div>
                            <div class="innerwrap_two">
                                <div class="IP_options">
                                    <div class="test_active" data-url="https://route.showapi.com/20-1">全球IP地址查询</div>
                                    <div data-url="https://route.showapi.com/20-2">域名查询</div>
                                </div>
                                <div class="gl_input">
                                    <label for="ip">输入IP地址:</label>
                                    <input type="test" id="ip" placeholder="例:116.4.201.181" required>
                                </div>
                                <div class="button">
                                    <button class="query">查询</button>
                                    <button class="colose">关闭</button>
                                </div>
                            </div>
                            <div class="innerwrap_three">
                                <div class="test_options">
                                    <div class="test_active" data-url='https://route.showapi.com/1617-5'>姓名打分</div>
                                    <div data-url='https://route.showapi.com/1617-4'>公司测吉凶</div>
                                    <div data-url='https://route.showapi.com/1617-3'>QQ号测吉凶</div>
                                    <div data-url='https://route.showapi.com/1617-2'>车牌号测吉凶</div>
                                    <div data-url='https://route.showapi.com/1617-1'>手机号测吉凶</div>
                                </div>
                                <div class="import">
                                    <div class="gl_input">
                                        <label for="xing">姓:</label>
                                        <input type="text" id="xing" placeholder="例:喜" required>
                                    </div>
                                    <div class="gl_input">
                                        <label for="ming">名:</label>
                                        <input type="text" id="ming" placeholder="例:羊羊" required>
                                    </div>
                                </div>
                                <div class="button">
                                    <button class="query">查询</button>
                                    <button class="colose">关闭</button>
                                </div>
                            </div>
                            <div class="innerwrap_four">
                                <div class="idiom_options">
                                    <div class="test_active" data-url='https://route.showapi.com/1196-2'>根据成语查注释</div>
                                    <div data-url='https://route.showapi.com/1196-1'>根据关键字搜成语</div>
                                </div>
                                <div class="idiom_import">
                                    <div class="gl_input">
                                        <label for="idiom">输入成语:</label>
                                        <input type="text" id='idiom' placeholder="例:掩耳盗铃" required>
                                    </div>
                                    <div class="gl_button">
                                        <label for="idiom_key">返回条数:</label>
                                        <button>-</button><input type="text" id='idiom_key' value="5" required><button>+</button>
                                    </div>
                                </div>
                                <div class="button">
                                    <button class="query">查询</button>
                                    <button class="colose">关闭</button>
                                </div>
                            </div>
                            
                        </div>
                    </div>
                    <div class="sear_result">
                        <div class="shut"><button class=" iconfont iconshanchu"></button></div>
                        <div class="content_box">
                            
                        </div>
                    </div>
                    
                </div>
                
            </div>
            <!-- <div class="show_message">

            </div> -->
            
            <!-- <div class="shade"></div> -->
            <div class="head">
                <div class="audio">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <!-- <div></div> -->
                </div>
                
                
                <ul class="navbar">
                    <li class="enter iconfont">&#xe628;</li>
                    <li class="change_page">
                        <div class="iconfont iconhome"></div>
                        <div class="iconfont iconhome"></div>
                    </li>
                    <li class="change_page">
                        <div>动画</div>
                        <div>动画</div>
                    </li>
                    <li class="change_page">
                        <div>聊天</div>
                        <div>聊天</div>
                    </li>
                    <li class="change_page">
                        <div>期待</div>
                        <div>期待</div>
                    </li>
                    <li class="change_page">
                        <div>关于</div>
                        <div>关于</div>
                    </li>
                </ul>
            </div>
            <div class="main">
                <div class="selector">
                    <div class="slid"><span class="iconfont iconright2"></span></div>
                    <div class="option_box">
                        <div class="option">
                            <div class="cangtoushi">藏头诗</div>
                            <div class="chengyu">IP地址查询</div>
                            <div class="jest">手机归属地</div>
                            <div class="phone_ip">测吉凶</div>
                            <div class="cejixiong">成语大全</div>
                        </div>
                    </div>
                    
                    <!-- <ul class="up">
                        <li>网页</li>
                        <li>图片</li>
                        <li>新闻</li>
                        <li>视频</li>
                        <li>地图</li>
                    </ul> -->
                    <!-- <div class="down"> -->
                        <!-- <div class="select"></div> -->
                        <!-- <input type="text" value="" placeholder="输入并搜索..."> -->
                        <!-- <div class="dialog"></div> -->
                    <!-- </div> -->
                </div>
                
                <!-- <div class="saying">
                    <p>无垠的沙漠热烈追求一叶绿草的爱，她摇摇头笑着飞开了。</p>
                    <p>The mighty desert is burning for the love of a bladeof grass who shakes her head and laughs and flies away.</p>
                </div> -->
                <!-- <div>三</div> -->
                <!-- <a href="javascript:;" title="你好!">
                    <div>
                        <div class="iconfont iconinfo"></div>
                    </div>
                </a> -->
            </div>
        </section>
        <section class="page_tow">
            <div class="main">
                <div class="scroll_bar">
                    <div style="background-color: rgba(243, 104, 224,.5);">
                        <div class="saying">
                            <p class="saying_one">最具挑战性的挑战莫过于提升自我。</p>
                            <p class="saying_one" >The most challenging challenge is to improve yourself.</p>
                        </div>
                    </div>
                    <div style="background-color: rgba(84, 160, 255,.5);">
                        <div class="saying">
                            <p>别再担心你不能控制的事情了，活在当下。</p>
                            <p>Take a break from worrying about what you can't control. Live a little.</p>
                        </div>
                    </div>
                    <div style="background-color: rgba(95, 39, 205,.5);">
                        <div class="saying">
                            <p>坚持信仰需要勇气。</p>
                            <p>It takes courage to belive.</p>
                        </div>
                    </div>
                    <div style="background-color: rgba(16, 172, 132,.5);">
                        <div class="saying">
                            <p>原因和结果,一切从选择开始。</p>
                            <p>Cause and effect. Everything begins with choice.</p>
                        </div>
                    </div>
                    <ul class="dot">
                        <li class="active"></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </div>
            </div>
        </section>
        <section class="page_three">
            <div class="main">
                <div class="chat_window">
                    <div class="accept">
                        <div></div>
                        <div>
                            <span>图灵机器人</span>
                            <!-- <p></p> -->
                            <div class="accept_content">
                                <pre>很高兴遇见你!来聊会儿吧～</pre>
                            </div>
                            
                        </div>
                    </div>
                    <div class="send">
                        <div></div>
                        <div>
                            <span>光头强</span>
                            <!-- <p></p> -->
                            <div class="send_content">
                                <pre></pre>
                            </div>
                            
                        </div>
                    </div>
                </div>
                <div class="edit_frame">
                    <div>
                        <textarea name="edit" id="letter" cols="10" rows="5" placeholder="回车键(ENTER)发送&#10CTRL+ENTER 换行"></textarea>
                    </div>
                    <div>
                        <button>发送</button>
                    </div>
            </div>
        </section>
        <section class="page_four">
            <div class="main">
            </div>
        </section>
        <section class="page_five">
            <div class="main">
                <a href="javascript:;"><img src="./src/imgs/youhua2.jpg" alt="" class="five_img"></a>
                <a href="javascript:;" title="邮箱"><img src="./src/imgs/youhua2.jpg" alt="" class="five_img"></a>
                <a href="https://gitee.com/holy_pig/projects" title="码云地址"><img src="./src/imgs/Screenshot.png" alt="" class="five_img"></a>
            </div>
        </section>
    </div>
    

    <script src="./lib/jquery.js"></script>
    <script src="./src/js/main.js"></script>
</body>
</html>